<!--
	开发者:宋成恩
	开发时间:2017-7-9
	修改时间:2017-7-9
	功能:个人用户修改简历中的工作经历,单独的表单组件 ../PersonResume.vue中调用
-->
<template>
  <div id="resumeWorkExperienceForm">
    <el-form :model="workExperienceInfo" :rules="workExperienceInfoRules" ref="workExperienceInfoForm"
             label-width="110px">
      <el-row>
        <el-col :span="7">
          <el-form-item label="公司名称：" prop="company_name">
            <el-input v-model="workExperienceInfo.company_name" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="单位规模：" prop="company_size">
            <el-select v-model="workExperienceInfo.company_size" size="small" style="width: 100%;">
              <el-option v-for="(optionitem,index) in companySizeList" :key="index" :label="optionitem.label"
                         :value="optionitem.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="所属部门：" prop="department">
            <el-input v-model="workExperienceInfo.department" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="下属人数(人)：" prop="subordinates">
            <el-input-number :controls="false" v-model="workExperienceInfo.subordinates" size="small"
                             style="width:100%"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="所属行业：" prop="industry_name">
            <el-select v-model="workExperienceInfo.industry_name" placeholder="请选择" style="width: 100%;" size="small">
              <el-option v-for="(item, index) in industryDataList" :key="index" :label="item.label"
                         :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="职位类别：" prop="position_type">
            <el-input v-model="workExperienceInfo.position_type" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="汇报对象：" prop="leader">
            <el-input v-model="workExperienceInfo.leader" placeholder="直系领导" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="起始时间：" prop="start_date" required>
            <el-date-picker v-model="workExperienceInfo.start_date" type="date" size="small" placeholder="选择起始时间"
                            :picker-options="pickerOptions" :clearable="false" style="width:100%"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="公司类型：" prop="company_type">
            <el-select v-model="workExperienceInfo.company_type" placeholder="请选择" style="width: 100%;" size="small">
              <el-option v-for="(item, index) in companyTypeList" :key="index" :label="item.label"
                         :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="职位名称：" prop="position_name">
            <el-input v-model="workExperienceInfo.position_name" size="small" style="width:100%"></el-input>
          </el-form-item>
          <el-form-item label="月薪：" prop="salary">
            <el-input-number :controls="false" v-model="workExperienceInfo.salary" size="small"
                             style="width:100%"></el-input-number>
          </el-form-item>
          <el-form-item label="结束时间：" prop="end_date" required>
            <el-date-picker v-model="workExperienceInfo.end_date" type="date" size="small" placeholder="选择结束时间"
                            :picker-options="pickerOptions" :clearable="false" style="width:100%"></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="工作描述：" prop="work_description">
        <el-input type="textarea" :autosize="{ minRows: 3}" placeholder="请输入自我测评"
                  v-model="workExperienceInfo.work_description" style="width:85%"></el-input>
      </el-form-item>
    </el-form>
    <div class="btn-box">
      <el-button type="info" size="large" @click="checkWorkInfoData">保存</el-button>
      <el-button type="info" size="large" @click="cancelWorkInfoEdit">取消</el-button>
    </div>
  </div>
</template>

<script>
  import { postDataToServer } from '../../../assets/js/post.js'
  import { formatterTime } from '../../../assets/js/common.js'
  import { getStaticMapList } from '../../../assets/js/GlobeDefine.js'
  import industryList from '../../../assets/file/industryList.json'

  export default {
    name: 'resumeWorkExperienceForm',
    props: ['resumeId', 'workId'],
    data () {
      return {
        workExperienceInfo: {
          company_name: '',
          company_type: 0,
          industry_name: '',
          company_size: 0,
          position_type: '',
          position_name: '',
          department: '',
          leader: '',
          salary: 0,
          subordinates: 0,
          start_date: '',
          end_date: '',
          work_description: ''
        },
        //用于给新增表单赋值
        workExperienceInfoSpare: {
          company_name: '',
          company_type: 0,
          industry_name: '',
          company_size: 0,
          position_type: '',
          position_name: '',
          department: '',
          leader: '',
          salary: 0,
          subordinates: 0,
          start_date: '',
          end_date: '',
          work_description: ''
        },
        workExperienceInfoRules: {
          company_name: [
            {required: true, message: '请填写公司名称', trigger: 'blur'},
            {min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'change'}
          ],
          industry_name: [
            {required: true, message: '请填写所属行业', trigger: 'blur'},
            {min: 1, max: 120, message: '长度在 1 到 120 个字符', trigger: 'change'}
          ],
          position_type: [
            {required: true, message: '请填写职位类别', trigger: 'blur'},
            {min: 1, max: 16, message: '长度在 1 到 16 个字符', trigger: 'change'}
          ],
          position_name: [
            {required: true, message: '请填写职位名称', trigger: 'blur'},
            {min: 1, max: 16, message: '长度在 1 到 16 个字符', trigger: 'change'}
          ],
          department: [
            {min: 1, max: 16, message: '长度在 1 到 16 个字符', trigger: 'change'}
          ],
          leader: [
            {min: 1, max: 30, message: '长度在 1 到 16 个字符', trigger: 'change'}
          ]
        },
        companySizeList: getStaticMapList('company_size'),
        companyTypeList: getStaticMapList('company_type'),
        industryList: [],
        industryDataList: industryList,
        pickerOptions: {
          disabledDate (time) {
            return Date.now() - 8.64e7 < time.getTime()
          }
        },
      }
    },
    created () {
      this.getCombobox()
      if (this.workId !== 'add') {
        this.getWorkExperienceInfo()
      } else {
        this.workExperienceInfo = this.workExperienceInfoSpare
      }
    },
    methods: {
      getCombobox () {
        let _this = this
        postDataToServer('HM_COMMON_INDUSTRY_LISTALL').then((data) => {
          if (data.status === 0) {
            _this.industryList = data.data_list
          }
        })
      },
      getWorkExperienceInfo () {
        let _this = this
        let parameter = new Object()
        parameter.id = this.workId
        postDataToServer('HM_RESUME_WORKS_GET', parameter).then((data) => {
          if (data.status === 0) {
            _this.workExperienceInfo = data.data_list
          }
        })
      },
      checkWorkInfoData () {
        let _this = this
        this.$refs['workExperienceInfoForm'].validate((valid) => {
          if (valid) {
            _this.saveWorkInfoData()
          } else {
            this.$message({
              message: '存在数据填写错误！',
              type: 'error'
            })

          }
        })
      },
      saveWorkInfoData () {
        let _this = this
        let path = 'HM_RESUME_WORKS_EDIT'
        if (this.workId === 'add') {
          path = 'HM_RESUME_WORKS_ADD'
          this.workExperienceInfo.resume_id = this.resumeId
        }
        this.workExperienceInfo.start_date = formatterTime('date', this.workExperienceInfo.start_date)
        this.workExperienceInfo.end_date = formatterTime('date', this.workExperienceInfo.end_date)
        postDataToServer(path, this.workExperienceInfo).then((data) => {
          if (data.status === 0) {
            _this.$emit('sendEditWorkStatus', 'success')
          } else {
            _this.$message.error(data.message)
          }
        })
      },
      cancelWorkInfoEdit () {
        this.$emit('sendEditWorkStatus', 'cancel')
      }
    }
  }
</script>

<style>
  .btn-box {
    width: 90%;
    text-align: center;
  }
</style>
